<template>
	<div class="post-container">
		<br />
		<!-- 发布帖子列表 -->
		<Table border :columns="columns1" :data="postList"></Table>
		<!-- 分页 -->
		<br />
		<div style="text-align: center;">
			<Page :total="total" show-sizer show-elevator @on-change="changePost" />
		</div>
	</div>
</template>

<script>
	import path from '@/api/path.js';
	let url = path.url;
	import axios from '@/libs/api.request';
	export default {
		data(){
			return {
				columns1: [{
						title: '发布时间',
						key: 'createTime',
						align: 'center'
					},
					{
						title: '标签名称',
						key: 'label',
						align: 'center'
					},
					{
						title: '内容',
						key: 'content',
						align: 'center'
					},
					{
						title: '状态',
						key: 'status',
						width: 100,
						align: 'center'
					},
					{
						title: '操作',
						key: 'action',
						width: 150,
						align: 'center',
						render: (h, params) => {
							return h('div', [
								h('Button', {
									props: {
										type: 'primary',
										size: 'small'
									},
									style: {
										marginRight: '10px'
									},
									on: {
										click: (e) => {
											this.goDetail(params.row);
										}
									}
								}, '详情'),
								h('Button', {
                                    props: {
                                        type: 'error',
                                        size: 'small'
                                    },
                                    on: {
                                        click: () => {
											this.delect(params.row)
                                        }
                                    }
                                }, '删除')
							]);
						}
					}
				],
				postList: [],
				page: 1,
				total: 0
			}
		},
		props: ['id'],
		methods: {
			// 分页
			changePost(idx){
				this.page = idx;
				this.getArticleList();
			},
			// 获取用户发布的帖子列表
			getPostList(){
				axios.request({
					url: `${url}Article/getArticleList`,
					method: 'post',
					data: {
						id: this.id
					}
				}).then(res=>{
					console.log(res,'id',this.id);
					if ( res.data.status == 1 ) {
						this.postList = res.data.content.data;
						this.total = res.data.content.total;
						this.postList.forEach(item=>{
                            item.status == 1 ? item.status = '显示' : item.status = '删除'
						})
					} else {
						throw '获取发布帖子数据失败！'
					}
				})
			},
			// 查看详情
			goDetail(obj) {
				if (obj) {
					this.$router.push({
						name: 'circleDetail',
						query: {
							id: obj.id
						}
					});
				} else {
					this.$router.push({
						name: '/'
					});
				}
			},
			// 删除
			delect(obj){
				console.log(obj);
				axios.request({
					url: `${url}article/delArticle`,
					method: 'post',
					data: {
						id: obj.id
					}
				}).then(res=>{
					if ( res.data.status == 1 ) {
						this.getPostList();
					} else {
						throw '删除失败！'
					}
				})
			},
		},
		created(){
			this.getPostList()
		}
	}
</script>

<style>

</style>
